<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>{$Think.config.site.title} - 登录</title>
	
  <meta name="keywords" content="{$Think.config.site.keywords}">
  <meta name="description" content="{$Think.config.site.description}">
  <link type="text/css" rel="stylesheet" href="{$Think.config.site.resource_url}css/sign.css" />
  <link href="{$Think.config.site.resource_url}css/font-awesome.css?v=4.4.0" rel="stylesheet">
  <style type="text/css">
    p#guoqi {position: absolute;background: #fff; filter:alpha(opacity=95);  -moz-opacity:0.95;  -khtml-opacity: 0.95;opacity: 0.95; top: -15px;left: 30%;color: #da251c;font-size: 18px; width:200px; height: 200px; display: none; }
    #code a{ text-decoration: none; }
    #nav{ padding:0px; }
    #guoqi .showerr{ position: absolute; top:80px; width: 100px; left: 50px; font-size: 14px;}
    #clickimg{color: #03c5ff;}
  </style>
</head>
<body>
    <div class="pages">
      <div class="content">
      <div class="login-header">
            <!--<img src="{$Think.config.site.resource_url}images/login/logo.png">-->
			<p>{$Think.config.site.title}</p>
      </div>
      <div class="tabPanel">
      <div class="nav">
        <ul id="nav">
          <a href="javascript:void(0)" class="active">微信扫码登录</a>　　|　　<a href="javascript:void(0)" >账号密码登录</a>
        </ul>
      </div>
      <div class="panes">
          <div class="pane" style="position: relative;display: block;" id="code">
            <img src="https://mp.weixin.qq.com/safe/safeqrcode?action=bindcomponent&uuid=5234f1100f0fe32e3710e9de7238af90&auth_type=1" alt="" width="200px" id="qcrode">
            <input type="hidden" name="key" value="" id="key">
            <p class="guoqi" id="guoqi"><span class="showerr">二维码已过期</span></p>
            <p style="font-size: 12px;">请使用微信扫描二维码登录<a href="javascript:void('0');" style="font-size: 12px;" id="clickimg">　<i class="fa fa-refresh" ></i> 刷新</a></p>
          </div>
          <div class="pane" style="">
            <div class="login-input-box">
                  <span class="icon icon-biaoshi"></span>
                  <input type="text" placeholder="请输入企业标识" id="identifying" required value="">
            </div>
            <div class="login-input-box">
                  <span class="icon icon-password"></span>
                  <input type="text" placeholder="请输入用户名" id="username" required value="">
            </div>
            <div class="login-input-box">
                  <span class="icon icon-user"></span>
                  <input type="password" placeholder="请输入密码" id="password" required>
            </div>
            <div class="login-button-box" id="submit"></div>
          </div>
      </div>
      </div>
      <div class="copyright">
        <p>{$Think.config.site.copyright}</p>
      </div>
      </div>
    </div>
    <script src="{$Think.config.site.resource_url}js/jquery.min.js?v=2.1.4"></script>
    <script type="text/javascript">
      $('.tabPanel ul a').click(function(){
        $(this).addClass('active').siblings().removeClass('active');
        $('.panes>.pane:eq('+$(this).index()+')').show().siblings().hide(); 
      });
    </script>
    <script src="{$Think.config.site.resource_url}js/bootstrap.min.js?v=3.3.5"></script>
  <script src="{$Think.config.site.resource_url}js/plugins/layer/layer.js"></script>
  <script>
$(document).ready(function(){
  $("#submit").bind('click',function(){
     doLogin();
  })
  $("#password").bind('keyup',function(e){
     var key = e.which;
     if( 13 == key ) {
      doLogin();
     }
  })
  function doLogin(){
    var username = $("#username").val();
    if(username == '') {
       $("#username").attr('placeholder','请输入用户名');
      $("#username").focus();
      return false;
    }
    if(username.length<3){
      layer.msg('用户名长度不能小于3位', {icon: 2});
      $("#username").focus();
      return false;
    }
    var password = $("#password").val();
    
    if(password == '' ) {
       $("#password").attr('placeholder','请输入密码');
      $("#password").focus();
      return false;
    }
    if(password.length<6){
      layer.msg('密码长度不能小于6位', {icon: 2});
      $("#password").focus();
      return false;
    }
    var identifying = $('#identifying').val();
    if(identifying==''){
      $('#identifying').attr('placeholder','请输入企业标识');
      $('#identifying').focus();
      return false;
    }
    $.ajax({
      type : 'POST',
      url : '<?php echo \think\Request::instance()->root(); ?>/ausagent/Login',
      dataType : 'json',
      data : {username : username, password : password,identifying:identifying},
      success : function(result) {
        if(0 === result.code) {
          location.href = result.url;
        } else if ( -1000 === result.code) {
          //帐号不存在
          $("#username").val("");
          $("#username").attr('placeholder','你输入的账号有误，请重新输入');
          $("#username").focus();
        }else if ( -1001 === result.code) {
          //帐号不存在
          $("#username").val("");
          $("#username").attr('placeholder','你输入的账号有误，请重新输入');
          $("#username").focus();
        } else if ( -1010 === result.code) {
          //密码错误
          $("#password").val("");
          $("#password").attr('placeholder','密码错误，请重新输入');
          $("#password").focus();
        } else if(-1040 === result.code){
           $("#identifying").val("");
           $("#identifying").attr('placeholder','企业标识错误,请重新输入');
           $("#identifying").focus();

        } else  {
          //密码错误
          $("#username").val("");
          $("#password").val("");
          $("#identifying").val("");
          $("#username").attr('placeholder','请输入用户名');
          $("#password").attr('placeholder','请输入密码');
          $("#identifying").attr('placeholder','请输入企业标识');
        }
      },
      error : function(){
        //layer.close(layer1);
        layer.msg('服务器错误！请稍后重试', {icon: 2});
      }
    })
  };
  {notempty name='$Think.cookie.username'}
  $("#password").focus();
  {/notempty}

  function qcrode(){
    $.ajax({
      async: false,
      url:'<?php echo \think\Request::instance()->root(); ?>/ausagent/Login/createkey',
      type:'GET',
      dataType:"json",
      success: function(data){
          //alert(data);
          var key = data;
          $('#key').val(key);
          $('#qcrode').attr('src','<?php echo \think\Request::instance()->root(); ?>/ausagent/Login/scancode/key/'+key);
      },
      error : function(){
        //layer.close(layer1);
        layer.msg('服务器错误！请稍后重试', {icon: 2});
      }

    });
  }
  window.onload=qcrode();
  
   function validatescancode(){
      var key = $('#key').val();
      $.ajax({
        type : 'POST',
        url : '<?php echo \think\Request::instance()->root(); ?>/ausagent/Login/validatescancode',
        dataType : 'json',
        data : {key : key},
        success:function(result){
            if(0 == result.code){
              location.href = result.url;
            }else if(1== result.code){
                $('#guoqi').show();
                clearInterval(ref);
            }else if(2== result.code){
               //layer.msg(result.msg, {icon: 1});
               $('.showerr').html(result.msg); 
               $('#guoqi').show();
            } 
        },
        error : function(){
          layer.msg('服务器错误！请稍后重试', {icon: 2});
        }

      });
   }
   var  ref = setInterval(function(){
         validatescancode();
                      
  },2000);

   $('#clickimg').click(function(){
      $.ajax({
        async: false,
        url:'<?php echo \think\Request::instance()->root(); ?>/ausagent/Login/createkey',
        type:'GET',
        dataType:"json",
        success: function(data){
            //alert(data);
            var key = data;
            $('#key').val(key);
            $('#guoqi').hide();
            $('#qcrode').attr('src','<?php echo \think\Request::instance()->root(); ?>/ausagent/Login/scancode/key/'+key);
            var  ref = setInterval(function(){
                   validatescancode();
                                
            },2000);
        },
        error : function(){
          //layer.close(layer1);
          layer.msg('服务器错误！请稍后重试', {icon: 2});
        }

      });
   });

})
</script>
</body>
</html>